<template>
	<view>
		<view class="bc" style="padding: 30px 20px 30px 20px;">
			<view class="user" style="width: 30%;" v-if="pic == ''">
				<image src="../../static/user.jpg" mode='widthFix'></image>
			</view>
			<view class="user" style="width: 30%;" v-else>
				<image :src="pic" mode='widthFix'></image>
			</view>
			<view class="" style="width: 70%;">
				<view class="bl">
					<view style="font-size: 18px;margin-bottom: 5px;">{{user.username}}</view>
					<view @click="toSetting">设置</view>
				</view>
				<view class="">{{user.phone}}</view>
			</view>
		</view>
		<view class="bkk">
			<view class="" @click="toWallet">
				<view class="bl b20">
					<view class="bc">
						<i class="ri-money-cny-circle-fill" style="color:#008040;font-size:24px;"></i>
						<!-- <i-icon size="24px" color="#008040" name="money-cny-circle-fill"></i-icon> -->
						<text>我的钱包</text>
					</view>
					<view>
						<i class="ri-arrow-right-s-line" style="color:#999;font-size:16px;"></i>
						<!-- <i-icon size="16px" color="#999" name="arrow-right-s-line"></i-icon> -->
					</view>
				</view>
			</view>
			<!-- 成功状态 -->
			<view class="bl" v-if="openState == 1">
				<view>
					<text style="font-size: 24px;">￥{{bal}}</text>
				</view>
				<view class="">
					<button class="b-middle" @click="toWithdraw()">去提现</button>
				</view>
			</view>
			<!-- 审核状态 -->
			<view class="bl" v-else-if="openState == 2">
				<view>
					<text style="font-size: 24px;">{{stateInfo}}</text>
				</view>
				<view class="">
					<button class="b-middle" @click="findOpenState()">刷新</button>
				</view>
			</view>
			<!-- 失败状态 -->
			<view class="bl" v-else-if="openState == 3">
				<view>
					<text style="font-size: 5px;">{{stateInfo}}</text>
				</view>
				<view class="">
					<button class="b-middle" @click="toOpenWallet()">重新提交</button>
				</view>
			</view>
			<view class="bl" v-else>
				<view>
					<text>您未开通电子钱包</text>
				</view>
				<view class="">
					<button class="b-middle" @click="toOpenWallet()">开通</button>
				</view>
			</view>
		</view>
		<view class="bkk">
			<view class="" @click="">
				<view class="bl b20">
					<view class="bc">
						<i class="ri-heart-fill" style="color:#f73164;font-size:24px;"></i>
						<!-- <i-icon size="24px" color="#f73164" name="heart-3-fill"></i-icon> -->
						<text>我的爱心能量</text>
					</view>
					<view>
						<i class="ri-arrow-right-s-line" style="color:#999;font-size:16px;"></i>
						<!-- <i-icon size="16px" color="#999" name="arrow-right-s-line"></i-icon> -->
					</view>
				</view>
				<view v-if="wallet">
					<text style="font-size: 24px;">{{wallet.loveEnergy}}个</text>
				</view>
				<view v-else>
					<text>您未开通电子钱包</text>
				</view>
			</view>
		</view>
		<view class="bkk">
			<view class="bl" @click="toAppointPage">
				<view class="bc">
					<i class="ri-time-fill" style="color:#008040;font-size:24px;"></i>
					<!-- <i-icon size="24px" color="#008040" name="time-fill"></i-icon> -->
					<text>我的预约订单</text>
				</view>
				<view>
					<i class="ri-arrow-right-s-line" style="color:#999;font-size:16px;"></i>
					<!-- <i-icon size="16px" color="#999" name="arrow-right-s-line"></i-icon> -->
				</view>
			</view>
		</view>
		<view class="bkk">
			<view class="bl" @click="toRecycleOrderPage">
				<view class="bc">
					<i class="ri-swap-fill" style="color:#008040;font-size:24px;"></i>
					<!-- <i-icon size="24px" color="#008040" name="swap-fill"></i-icon> -->
					<text>废旧回收订单</text>
				</view>
				<view>
					<i class="ri-arrow-right-s-line" style="color:#999;font-size:16px;"></i>
					<!-- <i-icon size="16px" color="#999" name="arrow-right-s-line"></i-icon> -->
				</view>
			</view>
		</view>
		<view class="bz" style="margin-top: 40px;"><button @click="logout">退出账号</button></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pic: '',
				stateInfo: '',
				openState: 0,
				siteID: '',
				bal: '',
				user: {
					username: '昵称',
					phone: '13333333333'
				},
				wallet: {
					money: 0,
					loveEnergy: 0
				},
				DataName: '',
				DataCerNo: ''
			}
		},
		methods: {
			//退出登录
			logout() {
				let _this = this;
				uni.showModal({
					content: '是否退出登录账号',
					success(res) {
						if (res.confirm) {
							uni.request({
								url: _this.baseURL + '/logout',
								method: 'GET',
								header: {
									token: uni.getStorageSync('token')
								},
								success(res) {
									if (res.data.success == true) {
										uni.getStorage({
											key: 'stationId',
											success: (res) => {
												_this.siteID = res.data;
											}
										});
										uni.clearStorage();
										uni.reLaunch({
											url: '../index/login?id=' + _this.siteID
										})
									} else {
										uni.showToast({
											title: res.data.message,
											icon: 'error',
											duration: 3000
										})
									}
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			},
			//我的钱包
			toWallet() {
				uni.navigateTo({
					url: 'u-wallet?openState=' + this.openState + '&account=' + this.virtualAccNo + '&bal=' + this
						.bal
				})
			},
			// 到提现页
			toWithdraw() {
				uni.navigateTo({
					url: 'u-tixian'
				})
			},
			/**到设置页*/
			toSetting() {
				let u = JSON.stringify(this.user)
				uni.navigateTo({
					url: 'u-setting?user=' + u
				})
			},
			//去开通钱包
			toOpenWallet() {
				uni.navigateTo({
					url: 'u-ktqb'
				})
			},
			toAppointPage() {
				uni.navigateTo({
					url: 'u-fwdd'
				})
			},
			toRecycleOrderPage() {
				uni.navigateTo({
					url: 'fj-order'
				})
			},
			// 获取用户信息
			getUserInfo() {
				let _this = this;
				uni.request({
					url: this.baseURL + '/find/user/info',
					method: 'POST',
					header: {
						token: uni.getStorageSync('token')
					},
					success: (res) => {
						let data = res.data;
						if (data.code === 0 || data.success == true) {
							let datas = data.data;
							_this.user.username = datas.username;
							_this.user.phone = datas.phone;
							_this.wallet.loveEnergy = datas.score;
							if (datas.pic != null || datas.pic != undefined) {
								//_this.pic = 'data:image/jpeg;base64,'+datas.pic;
								_this.pic = 'https://admin.yunshuicha.com' + datas.pic;
							}
						} else {
							uni.showToast({
								title: data.msg || data.message,
								icon: 'error',
								duration: 3000
							})
						}
					},
					fail: (e) => {
						console.warn(e)
					}
				});
			},
			// 获取钱包信息
			getWalletInfo() {
				let _this = this
				uni.request({
					url: _this.baseURL + '/gr/find/one',
					method: "POST",
					header: {
						'token': uni.getStorageSync('token')
					},
					success(res) {
						console.log(res)
						if (res.data.success == true) {
							let rData = res.data.data[0];
							_this.DataName = rData.userName;
							_this.DataCerNo = rData.cerNo;
							_this.stateInfo = rData.state;
							_this.findOpenState()
						}
					}
				})
			},
			/** 查询开户状态 */
			findOpenState(e) {
				let _this = this
				uni.request({
					url: _this.baseURL + '/gr/open/state?userName=' + _this.DataName + '&cerNo=' + _this.DataCerNo,
					method: "GET",
					header: {
						'token': uni.getStorageSync('token')
					},
					success(res) {
						console.log(res)
						if (res.data.code == '9600') {
							_this.stateInfo = '审核中，预计五分钟';
							_this.openState = 2; //审核状态
						} else
						if (res.data.success == true) {
							_this.findPersonBal();
						} else {
							_this.openState = 3; //失败状态
						}
					}
				})
			},
			/**  查询账户余额 */
			findPersonBal() {
				let _this = this
				uni.request({
					url: _this.baseURL + '/gr/list/xq?username=' + _this.DataName + '&cerNo=' + _this.DataCerNo,
					method: "GET",
					header: {
						'token': uni.getStorageSync('token')
					},
					success(res) {
						console.log(res)
						let Xdata = res.data.data;
						if (res.data.success == true) {
							_this.openState = 1; //成功状态
							_this.bal = Xdata.bal; //余额
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'error',
								duration: 3000
							})
						}
					}
				})
			}
		},
		onLoad() {
			if (!uni.getStorageSync('token')) {
				uni.showModal({
					title: '您还未登录，请先进行登录',
					success(res) {
						if (res.confirm) {
							uni.redirectTo({
								url: 'login'
							})
							return
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})

			} else {
				this.getUserInfo()
				this.getWalletInfo()
			}

		}
	}
</script>
